﻿@page "/utilities/pointer-events"

<DocsPage>
    <DocsPageHeader Title="Pointer Events" SubTitle="Specifies if an element responds to pointer events." />
    <DocsPageContent>

        <DocsPageSection>
            <SectionHeader Title="Class Reference" HideTitle="true" />
            <DocsAutoGen_Interactivity_Pointerevents/>
        </DocsPageSection>
        
        <DocsPageSection>
            <SectionHeader Title="Basic Usage">
                <Description>
                    With pointer events you can control if an element reacts to pointer events. Try hovering over the text below and note the difference.
                </Description>
            </SectionHeader>
            <SectionContent Code="@nameof(PointerEventsExample)" HighLight="pointer-events-auto,pointer-events-none">
                <PointerEventsExample/>
            </SectionContent>
        </DocsPageSection>
        
        
    </DocsPageContent>
</DocsPage>
